<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div>
        <h1>The Ajax 01 Page</h1>
        <fieldset>
            <legend>Ajax 异步请求</legend>
            <button onclick="doAjaxGet()">Ajax Get Request</button>
            <span id="resultId">Loading data ...</span>
        </fieldset>
    </div>
    <script>
        function doAjaxGet() {
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    var result = xhr.responseText;
                    document.getElementById("resultId").innerHTML = result;
                }
            }
            xhr.open("get","http://localhost/doAjaxGet",true);
            xhr.send(null);

            console.log("do other ...");
        }
    </script>
</body>
</html>